<template>
    <div class="bz-page">
        <div class="bz-banner">CEREBRO</div>
        <div class="bz-mb">
            <div class="bz-mb-left">
                <div class="bz-panel-a">
                    <div class="bz-panel-head">
                        <div class="bz-title-bar">
                            <div class="bz-icon">
                                <img src="../../assets/images/hxdp/img_title_ring.svg" alt="">
                                <div class="bz-bg bz-bg-1"></div>
                            </div>
                            <div class="bz-title">同业规模对比</div>
                        </div>
                    </div>
                    <div class="bz-panel-body">
                        <div class="bz-tab-a">
                            <div class="bz-tab-item bz-active">
                                <div class="bz-name">ETF</div>
                            </div>
                            <div class="bz-tab-item">
                                <div class="bz-name">非货非理财</div>
                            </div>
                            <div class="bz-tab-item">
                                <div class="bz-name">权益类</div>
                            </div>
                            <div class="bz-tab-item">
                                <div class="bz-name">债券类</div>
                            </div>
                        </div>
                        <div class="bz-chart-box-1"></div>
                    </div>
                    <div class="bz-panel-foot">
                        <div class="bz-data-date">数据披露日：2020-12-28</div>
                    </div>
                </div>
                <div class="bz-panel-a">
                    <div class="bz-panel-head">
                        <div class="bz-title-bar">
                            <div class="bz-icon">
                                <img src="../../assets/images/hxdp/img_title_ring.svg" alt="">
                                <div class="bz-bg bz-bg-2"></div>
                            </div>
                            <div class="bz-title">同业规模对比</div>
                        </div>
                    </div>
                    <div class="bz-panel-body">
                        <div class="bz-tab-b">
                            <div class="bz-tab-item bz-active">
                                <div class="bz-name">主动权益</div>
                            </div>
                            <div class="bz-tab-item">
                                <div class="bz-name">主动固收</div>
                            </div>
                        </div>
                        <div class="bz-chart-box-2">
                            <div class="bz-chart-lg">
                                <div class="bz-pie-box-1">
                                    <div class="bz-pie-1"></div>
                                    <div class="bz-ring bz-ring-1"></div>
                                    <div class="bz-ring bz-ring-2"></div>
                                    <div class="bz-ring bz-ring-3"></div>
                                    <div class="bz-ring bz-ring-4"></div>
                                </div>
                                <div class="bz-panel-c">
                                    <div class="bz-tab-c">
                                        <div class="bz-tab-item bz-active">四分位</div>
                                        <div class="bz-tab-item">三分位</div>
                                        <div class="bz-tab-item">10%</div>
                                    </div>
                                    <ul class="bz-list-a">
                                        <li class="bz-li">
                                            <div class="bz-name">
                                                <div class="bz-dotted bz-dotted-1"></div>
                                                <div class="">25%</div>
                                            </div>
                                            <div class="bz-value">25只</div>
                                        </li>
                                        <li class="bz-li">
                                            <div class="bz-name">
                                                <div class="bz-dotted bz-dotted-2"></div>
                                                <div class="">50%</div>
                                            </div>
                                            <div class="bz-value">30只</div>
                                        </li>
                                        <li class="bz-li">
                                            <div class="bz-name">
                                                <div class="bz-dotted bz-dotted-3"></div>
                                                <div class="">75%</div>
                                            </div>
                                            <div class="bz-value">65只</div>
                                        </li>
                                        <li class="bz-li">
                                            <div class="bz-name">
                                                <div class="bz-dotted bz-dotted-4"></div>
                                                <div class="">100%</div>
                                            </div>
                                            <div class="bz-value">5只</div>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="bz-chart-sm">
                                <div class="bz-pie-sm"></div>
                                <div class="bz-pie-sm"></div>
                                <div class="bz-pie-sm"></div>
                                <div class="bz-pie-sm"></div>
                            </div>
                        </div>
                    </div>
                    <div class="bz-panel-foot">
                        <div class="bz-data-date">数据披露日：2020-12-28</div>
                    </div>
                </div>
            </div>
            <div class="bz-mb-center"></div>
            <div class="bz-mb-right">
                <div class="bz-panel-b">
                    <div class="bz-panel-head">
                        <div class="bz-title-bar">
                            <div class="bz-icon">
                                <img src="../../assets/images/hxdp/img_title_ring.svg" alt="">
                                <div class="bz-bg bz-bg-3"></div>
                            </div>
                            <div class="bz-title">信息资讯</div>
                        </div>
                    </div>
                    <div class="bz-panel-body">
                        <div class="bz-card">
                            <div class="bz-title-bar">
                                <div class="bz-title">新闻资讯</div>
                                <div class="bz-split"></div>
                            </div>
                            <div class="bz-card-body">
                                <ul class="bz-list-b">
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="bz-card">
                            <div class="bz-title-bar">
                                <div class="bz-title">新闻资讯</div>
                                <div class="bz-split"></div>
                            </div>
                            <div class="bz-card-body">
                                <ul class="bz-list-b">
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                    <li class="bz-li">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">深圳市副市长艾学峰莅临公司调研</div>
                                    </li>
                                    <li class="bz-li bz-li-odd">
                                        <div class="bz-dotted-b"></div>
                                        <div class="bz-title">2019年度企业债券主承销商和评级机构信用…</div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "Hxdpv2",
        mounted() {
            (() => {
                return {
                    resizeBody() {
                        document.querySelector('body').style.zoom = (window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth) / 1920;
                    },
                    register() {
                        window.onresize = this.resizeBody;
                        this.resizeBody();
                    }
                }
            })().register();
        }
    }
</script>
<style lang="less" scoped>
    @import "../../assets/style/hxdpv2";
</style>
